<template>
	<view class="content">
		<view class="u-flex-x-center steps_warp">
			<u-steps :current="current" activeColor="#FF7612" inactiveColor="#ECEBF1">
				<u-steps-item :title="item.title" iconSize='64px' @change_current="change_current" :index="index"
					v-for="(item,index) in steps_list" :key="index">

				</u-steps-item>

			</u-steps>
		</view>
		<view class="cell-group_warp">
			<u--form labelPosition="left" :model="formData" :rules="rules" ref="uForm">
				<view class="cell-group u-border-radius" v-if="(current==0||current==1||current==2)&&isShowArr">
					<u-form-item label="" :prop="item.fieldName" v-for="item in information_list"
						v-if="item.is_show!=true">
						<yy-cell-v2 v-model="formData[item.fieldName]" ref="child" @change_list="change_list"
							:config='item' :is_audit='is_audit'>
						</yy-cell-v2>
					</u-form-item>

				</view>
				<view v-else-if="(current==3||current==4)&&isShowArr">
					<u-form-item label="" class="form_item" :prop="item.fieldName" v-for="item in information_list"
						v-if="current==item.id">
						<yy-uploadpictures :config='item' v-model="formData[item.fieldName]"></yy-uploadpictures>
					</u-form-item>
				</view>
				<view class="cell-group u-border-radius" style="margin-bottom:20rpx;" v-if="current==3&&isShowArr">
					<u-form-item label="" prop="descriptiveDescription">
						<yy-cell-v2 v-model="formData['descriptiveDescription']" ref="child" @change_list="change_list"
							:config='descriptiveDescriptions' :is_audit='is_audit' @change_value="change_value">
						</yy-cell-v2>
					</u-form-item>

				</view>
				<!-- 	<view class="cell-group u-border-radius" style="margin-bottom:20rpx;" v-if="current==3&&isShowArr">
					<u-form-item label="" prop="descriptiveDescription">
						<yy-cell-v2 v-model="formData['agreement']" ref="child" @change_list="change_list"
							:config='agreement' :is_audit='is_audit' @change_value="change_value">
						</yy-cell-v2>
					</u-form-item>
				</view> -->
				<!-- // -->


			</u--form>
			<view class="tip" v-if="Tooltip!=''">
				<text>{{Tooltip}}</text>
			</view>
			<view class="last_step" @click="last_step" v-if="current>0">
				<text>上一步</text>
			</view>
			<view class="next" @click="submit" v-if="current==4">
				<text>通过</text>
			</view>
			<view class="next" @click="next" :data-index="current" v-else>
				<text>下一步</text>
			</view>

			<u-popup :show="modal_show" @close="modal_show=false" mode="center" :round='20'>
				<view class="modal u-flex-column u-flex-between">
					<text class="modal_title">{{title}}</text>
					<view class="moda_content">
						<text>资料审核中，请耐心等待</text>
						<text>请将您的ID:'{{id}}'告知红娘</text>
					</view>
					<view class="u-flex-x-center u-flex-between">
						<view class="modalbtn modalbtn_left" @click="copy">
							<text>复制ID</text>
						</view>
						<view class="modalbtn modalbtn_right" @click="modal_show=false">
							<text>关闭</text>
						</view>
					</view>
				</view>
			</u-popup>
		</view>
	</view>
</template>

<script>
	import {
		user_info
	} from '@/util/user_info.js'
	import util from '@/common/image_processing.js'
	import {
		getAddress,
		getMemberInfo,
		basicInfo,
		getBasicInfo,
		getUserBasicInfo,
		editBasicInfo,
		getMemberList
	} from '@/common/api.js'
	export default {
		data() {
			return {
				descriptiveDescriptions: {
					title: '形容描述',
					fieldName: 'descriptiveDescription',
					is_show: false,
					modality: 'add_input',
					array: [],
				},
				is_audit: '',
				title: '温馨提示',
				id: '58749',
				modal_show: false,
				isShowArr: true,
				current: 0,
				information_list: user_info.fieldName_list,
				Tooltip: '',
				current_info: [
					[],
					[],
					[],
					[],
					[]
				],
				steps_list: [{
					title: '基础信息'
				}, {
					title: '补充信息'
				}, {
					title: '基本联系'
				}, {
					title: '展示自己'
				}, {
					title: '基础证照'
				}],
				rules: {

				},
				// Number(new Date())
				formData: {
					memberId: 0, //会员id
					matchmakerUid: 0, //红娘用户id
					fullName: '', //姓名
					sex: '', //性别 可以 填 男 or 女
					birthday: Number(new Date('1995-12-26')), //出生日期
					nlBirthday: Number(new Date('1995-12-26')), //农历出生日期
					constellation: '', //星座
					height: '', //身高
					weight: '', //体重
					education: '', //学历
					jgAddress: '', //籍贯省市区 - 隔开
					nhAddress: '', //现居省市区 - 隔开
					occupation: '', //职业
					annualSalary: '', //年薪
					housingSituation: '', //住房情况
					houseNum: '', //房产数量
					houseInfo: '', //房产详细
					carPurchase: '', //购车情况
					carNum: '', //车俩数量
					carBrand: '', //车品牌
					familyMembers: '', //家庭成员
					parentOccupation: '', //父母职业
					religion: '', //宗教
					canSmoke: '', //会不会抽烟
					likeDrink: '', //爱喝酒吗
					describeYourself: '', //描述自己
					hobby: '', //爱好
					maritalStatus: '', //婚姻状况
					canAcceptMarriageHistory: '', //能否接受对方有婚史
					acceptance: '', //有婚史接受程度
					oneParentFamily: '', //是否单亲家庭
					emotionalAutonomy: '', //父母会参与感情还是完全自主？
					criminalCaseBottom: '', //自己或直系亲属有无刑事案底(不展示)
					fraction: '', //(满分10分)给自己综合打几分(不展示)
					// sheHeightMin:0,//	希望对方身高最小
					sheEducation: '', //希望对方最低学历
					sheInSystemOrBusiness: '', //希望对方体制内还是上班/经商型
					sheWeddingRoom: '', //希望对方婚房情况
					sheVehicle: '', //希望对方车辆情况
					sheKeepPets: '', //是否介意对方养宠物
					sheBrotherOrSister: '', //是否介意对方有兄弟或姐妹
					sheSmoking: '', //是否介意对方抽烟
					sheDrinking: '', //是否介意对方喝酒
					sheReligiousBelief: '', //是否介意对方宗教信仰不同
					sheOneParentFamily: '', //是否介意对方是单亲家庭
					sheType: '', //你及你家人希望Ta是什么类型
					phone: '', //手机号码
					linealSystem: '', //直系联系号码
					wechat: '', //微信号
					frontalView: '[]', //正面照
					idPhoto: '[]',
					sheHeight: "",
					sheAge: '',
					member_info: '',
					matchmakerMeitu: '[]',
					descriptiveDescription: '',
					familyAnnualSalary:''
					// agreement:'[]'
				}
			}
		},
		onLoad(option) {
			this.current_info[0] = user_info.fieldName_list
			this.current_info[1] = user_info.fieldName_list1
			this.current_info[2] = user_info.fieldName_list2
			this.current_info[3] = user_info.fieldName_list3
			this.current_info[4] = user_info.fieldName_list4
			if (option.id) {
				this.formData.memberId = option.id
			}
			if (option.is_audit) {
				this.is_audit = option.is_audit
			}
			if (option.userId) {
				this.formData.matchmakerUid = option.userId
				this.get_UserBasicInfo()
			}
			this.Tooltip = this.retrieval_current(this.current)
		},
		watch: {
			formData: {
				handler(value) {
					console.log('深度监听', value)
				},
				deep: true // 深度监听
			},
			current(val) {
				this.Tooltip = this.retrieval_current(val)
			}
		},
		computed: {

		},
		async onShow() {
			try {
				if (uni.getStorageSync('access_token')) {
					let {
						matchmakerUid,
						memberId
					} = this.formData
					let info = await this.getMember_List()
					this.information_list[0].array = info
					if (matchmakerUid && is_audit == '') {
						let {
							name,
							days
						} = await this.get_MemberInfo(memberId)
						let day = days == 0 ? '无限期' : days + '天'
						this.$set(this.formData, 'member_info', name + '(' + day + ')')

					}

				} else {
					uni.navigateTo({
						url: '/pages/authorization/index'
					})
				}
			} catch (e) {
				//TODO handle the exception
			}
		},
		methods: {
			getMember_List() {
				return new Promise(resolve => {
					getMemberList({
						custom: {
							auth: false,
							toast: false,
							catch: false
						}
					}).then((result) => {
						resolve(result)
						// this.columns = [r]
						// this.user = r[0]
					}).catch((err) => {
						reject(err)
					})

				})

			},
			change_value(e) {

				this.information_list = this.information_list.map(item => {
					if (item.formData == e.fieldName) {
						return e
					}
					return item
				})
			},
			copy() {
				uni.setClipboardData({
					data: this.id,
					success: () => {
						uni.showToast({
							icon: 'none',
							title: '复制成功'
						});
					}
				});
			},
			get_UserBasicInfo() {
				let data = {
					params: {
						userId: this.formData.matchmakerUid
					}
				}

				getUserBasicInfo(data, {
					custom: {
						auth: false,
						toast: false,
						catch: false
					}
				}).then((result) => {
					if (result.matchmakerMeitu == '') {
						result.matchmakerMeitu = '[]'
					}
					if (result.agreement == '') {
						result.agreement = '[]'
					}
					this.$set(this, 'formData', result)
					let arr = []
					for (const [key, value] of Object.entries(result)) {
						arr.push({
							name: key,
							value: value
						})
					}
					this.current_info[0].forEach((item, index) => {
						arr.forEach(it => {
							if (item.selectfieldName && (item.selectfieldName == it.name)) {
								item.is_audit = it.value
							}
						})
					})
					this.information_lis = this.current_info[0]
					let {
						frontalView,
						idPhoto,
						agreement
					} = this.formData
					this.formData.agreement = util.process_Pictures(agreement)
					this.formData.frontalView = util.process_Pictures(frontalView)
					this.formData.idPhoto = util.process_Pictures(idPhoto)
					this.formData.matchmakerMeitu = util.process_Pictures(matchmakerMeitu)
				}).catch((err) => {

				})

			},
			get_BasicInfo() {
				return new Promise(resolve => {
					getBasicInfo().then((result) => {
						resolve(result)
					}).catch((err) => {
						reject(err)
					})

				})
			},
			change_current(index) {
				if (index == this.current || index > this.current) {
					return
				}
				this.current = index
				this.view_display()
			},
			view_display() {
				this.isShowArr = false;
				this.$nextTick(() => {
					this.isShowArr = true;
				})
			},
			retrieval_current(current) {
				switch (current) {
					case 0:

						this.information_list = user_info.fieldName_list;
						return "请如实录入个人基本资料，便于给您提供更好的服务，不 真实的录入所造成的后果将按合同所约定执行";
						break;
					case 1:

						this.information_list = user_info.fieldName_list1;
						return "请如实录入个人基本资料，便于给您提供更好的服务，不 真实的录入所造成的后果将按合同所约定执行";
						break;
					case 2:

						this.information_list = user_info.fieldName_list2
						return "联系资料仅供登记审核，平台将加密处理且不会主 动泄露给任何人";
						break;
					case 3:
						this.information_list = user_info.fieldName_list3;
						return "";
						break;
					case 4:
						this.information_list = user_info.fieldName_list4;
						return "";
						break;
				}
			},
			change_list(e) {
				let {
					name,
					obj
				} = e
				if (obj.title == '权限') {
					obj.array.forEach(item => {
						if (item.name == name) {
							this.formData.memberId = item.id
						}
					})

					return
				}
				this.information_list.forEach(item => {
					if (name == '暂时无房' && (item.fieldName == 'houseNum' || item.fieldName ==
							'houseInfo')) {
						item.is_show = true
					} else if ((name == '有房' || name == '有房(城区)') && (item.fieldName == 'houseNum' || item
							.fieldName == 'houseInfo')) {
						item.is_show = false
					} else if (name == '暂无代步车' && (item.fieldName == 'carNum' || item.fieldName ==
							'carBrand')) {
						item.is_show = true
					} else if ((name == '有代步车' || name == '有代步车(BBA及以上)') && (item.fieldName ==
							'carNum' ||
							item.fieldName == 'carBrand')) {
						item.is_show = false
					} else if (obj.title == '能否接受对方有婚史' && name == '不能' && item.fieldName == 'acceptance') {
						item.is_show = true
					} else if (obj.title == '能否接受对方有婚史' && name == '能' && item.fieldName == 'acceptance') {
						item.is_show = false
					}
				})
			},
			get_MemberInfo(memberId) {
				let data = {
					params: {
						memberId: memberId
					}
				}
				return new Promise(resolve => {
					getMemberInfo(data, {
						custom: {
							auth: false,
							toast: false,
							catch: false
						}
					}).then((result) => {
						resolve(result)
					}).catch((err) => {
						reject(err)
					})

				})
			},
			get_Address() {
				return new Promise(resolve => {
					getAddress({
						custom: {
							auth: false,
							toast: false,
							catch: false
						}
					}).then((result) => {
						resolve(result);
					}).catch((err) => {

					})
				}).catch((e) => {});

			},
			last_step() {
				this.current--;
				this.view_display()
			},
			rule_validate(key, value, arr) {

				let brr = []
				if (key == 'houseNum' || key == 'houseInfo' || key == 'carNum' || key == 'birthday' || key ==
					'nlBirthday' || key == 'carBrand' || key == 'acceptance' || key == 'agreement'||key=='familyAnnualSalary') {
					return brr
				}


				arr.forEach(item => {
					if (item.fieldName == key && ((typeof value === 'number' && key == 0) || value == '[]' ||
							value == '')) {
							
						brr.push(item.title)
					}
				})
				return brr
			},

			submit() {
				let regroupArr = [...this.current_info[0], ...this.current_info[1], ...this.current_info[2], ...this
					.current_info[3], ...this.current_info[4]
				]
				for (const [key, value] of Object.entries(this.formData)) {
					if (this.current == 3 || this.current == 4) {
						let item= this.check_picture(key, value)
						
						if (item.boolean) {
							return uni.$u.toast(item.message)
						}
					}
					let boolen = this.rule_validate(key, value, regroupArr)
					if (boolen.length > 0) {
						return uni.$u.toast(boolen[0] + '不为空')
					}
				}
				let isclick = true
				if (this.current == 4 && isclick) {
					isclick = false
					uni.showLoading({
						title: '加载中'
					});
					if (this.is_audit == '审核' || this.is_audit == '编辑') {
						this.formData.status = 1
						this.current_info[0].forEach(item => {
							if (item.selectfieldName) {
								this.formData[item.selectfieldName] = item.is_audit

							}

						})
						editBasicInfo(this.formData, {
							custom: {
								auth: true,
								toast: false,
								catch: true
							}
						}).then((r) => {
							isclick = true
							uni.$u.toast('审核通过')
							var pages = getCurrentPages(); //当前页
							var beforePage = pages[pages.length - 2]; //上个页面
							// #ifdef H5
							beforePage.init()
							// #endif
							// #ifndef H5
							beforePage.$vm.init()
							// #endif
							setTimeout(() => {
								uni.navigateBack()
							}, 1000)
						}).catch((err) => {
							console.log(err)
							uni.hideLoading();
						})
					} else {
						basicInfo(this.formData, {
							custom: {
								auth: true,
								toast: false,
								catch: true
							}
						}).then((r) => {
							isclick = true
							this.modal_show = true
						}).catch((err) => {
							uni.hideLoading();
						})
					}
				}
			},
			check_picture(key, value) {
				let msg = ''
				let boolean = false
				if (key == 'frontalView' || key == 'matchmakerMeitu'  || key == 'idPhoto') {
					let urls = JSON.parse(value)
					
					urls.forEach(item => {
						if (item.message && item.message == '上传中') {
							boolean = true
						}
					})
					// console.log(regroupArr)
					if (urls.length == 0) {
						msg='图片不为空'
					}
					if (boolean) {
						msg='图片上传中,请耐心等待'
					}
					console.log(msg)
					
					// return true
				}
				return {
					'message': msg,
					'boolean': boolean
				}

			},
			next() {

				let regroupArr = this.current_info[this.current]
				console.log(regroupArr)

				for (const [key, value] of Object.entries(this.formData)) {
					if (this.current == 3 || this.current == 4) {
						let item= this.check_picture(key, value)
						
						if (item.boolean) {
							return uni.$u.toast(item.message)
						}
					}
					// if(flag)return

					let boolen = this.rule_validate(key, value, regroupArr)

					if (boolen.length > 0) {
						
						return uni.$u.toast(boolen[0] + '不为空')

					}

				}
				uni.pageScrollTo({
					scrollTop: 0, // 滚动到页面的目标位置  这个是滚动到顶部, 0 
					duration: 300 // 滚动动画的时长
				})
				if (this.current < 4) {
					this.current++
				}
				this.view_display()
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		min-height: 100%;
		height: 100%;

		.cell-group_warp {
			padding: 0 24rpx 95rpx;
			box-sizing: border-box;

			.cell-group {

				.cell {
					background-color: #fff;
					margin-bottom: 20rpx;
					border-radius: 16rpx;
					height: 108rpx;
					display: flex;
					align-items: center;
					justify-content: space-between;
					padding: 0 32rpx 0 33rpx;

					.label {
						color: #111111;
					}

					text {
						font-size: 28rpx;
					}

					.name {
						color: #929191;
					}
				}
			}

		}


		.tip {
			width: 601rpx;
			text-align: center;
			margin: 0 auto 51rpx;

			text {
				font-size: 24rpx;
				color: #929191;
			}
		}

		.next {
			width: 620rpx;
			height: 92rpx;
			background: #FF7612;
			border-radius: 46rpx;
			color: #fff;
			text-align: center;
			line-height: 92rpx;
			margin: auto;
			box-sizing: border-box;

			text {
				font-size: 28rpx;
			}
		}

		.last_step {
			width: 620rpx;
			height: 92rpx;
			border: 2rpx solid #FF7612;
			border-radius: 46rpx;
			color: #FF7612;
			text-align: center;
			line-height: 92rpx;
			margin: auto;
			box-sizing: border-box;
			display: flex;
			    align-items: center;
			    justify-content: center;
			text {
				font-size: 28rpx;
			}

			margin-bottom: 20rpx;
		}

		.slot-icon {
			width: auto;
			height: 40rpx;
			background-color: #fff;
			line-height: 40rpx;
			border-radius: 20rpx;
			text-align: center;
			border: 2rpx solid #ECEBF1;
			font-size: 24px;
			color: #FF7612;
			display: block;
			box-sizing: border-box;
			padding: 0 15rpx;
		}

		.steps_warp {
			box-sizing: border-box;
			background-color: #F4F5F7;
			align-items: center;
			padding: 36rpx 24rpx;

			text {
				font-size: 28rpx;
				color: #929191;
			}
		}

		.modal {
			width: 650rpx;
			height: 392rpx;
			padding: 56rpx 36rpx 38rpx;
			box-sizing: border-box;
			text-align: center;

			.modal_title {
				color: #111111;
				font-size: 34rpx;
				font-weight: bold;
			}

			.moda_content {
				width: 380rpx;
				margin: auto;
				text-align: center;
				line-height: 48rpx;

				text {
					display: block;
					font-size: 30rpx;
					color: #111111
				}
			}

			.modalbtn {
				width: 277rpx;
				line-height: 92rpx;
				text-align: center;
				border-radius: 45rpx;

				&.modalbtn_left {
					background-color: #F6F6F6;

					text {
						font-size: 30rpx;
						color: #111111;
					}
				}

				&.modalbtn_right {
					background-color: #FF7612;

					text {
						font-size: 30rpx;
						color: #fff;
					}
				}
			}
		}

		/deep/ .u-form-item__body {
			padding: 0rpx 0 20rpx !important;
		}
	}
</style>
